@import './base.less';
@import './common.less';

body {
  background-color: #fafafa;
}
// 头部
header {
  .title {
    color: rgb(0, 0, 0);
    background-color: #fff;
    .back {
      position: absolute;
      left: 0;
      right: 0;
      width: 10.6667vw;
      height: 10.6667vw;
      text-align: center;
      line-height: 10.6667vw;
      //   background-color: pink;
      .iconfont {
        font-size: 5.8667vw;
      }
    }
  }
}

// 底部
footer {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 998;
  height: 14.1333vw;
  background-color: #fff;
  div {
    width: 32.8vw;
    height: 9.6vw;
    border-radius: 4.2667vw;
    text-align: center;
    line-height: 9.6vw;
    color: #fff;
  }

  .add {
    background: linear-gradient(90deg, #ffa600, #fb0);
  }
  .buy {
    background: linear-gradient(90deg, #f9211c, #ff6335);
  }
}

// 主体
.main {
  padding: 12vw 0 14.1333vw 0;
  .banner {
    .swiper-container {
      position: relative;
      // .swiper-count {
      //   display: none;
      //   position: absolute;
      //   right: 4.8vw;
      //   bottom: 9.6vw;
      //   z-index: 996;
      //   display: flex;
      //   width: 10.6667vw;
      //   height: 5.3333vw;
      //   color: #fff;
      //   justify-content: center;
      //   align-items: center;
      //   background-color: rgba(0, 0, 0, 0.363);
      //   border-radius: 2.6667vw;
      // }
    }
  }

  .title {
    margin-top: 3.2vw;
    padding: 3.2vw 4vw;
    height: 25.3333vw;
    background-color: #fff;
    font-size: 3.4667vw;
    color: #959595;
    .price {
      display: flex;
      justify-content: space-between;
      .left {
        span {
          &:first-child {
            color: #fa2209;
            i {
              font-size: 5.6vw;
            }
          }
        }
        .del {
          text-decoration: line-through;
        }
      }
      .right {
        display: flex;
        align-items: center;
      }
    }
    p {
      margin-top: 1.3333vw;
      width: 100%;
      font-size: 4vw;
      color: #303133;
    }
  }

  // 服务
  .service-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 3.2vw 4vw;
    width: 100%;
    height: 12.8vw;
    font-size: 3.7333vw;
    .s_left {
      display: flex;
      font-size: 3.4667vw;
      .s_item {
        margin: 0 1.8667vw;
        .iconfont {
          font-size: 3.4667vw;
          color: #fa2209;
        }
      }
    }
    .s_right {
      line-height: 6.4vw;
      .iconfont {
        font-size: 3.4667vw;
      }
    }
  }
  // 评价
  .talk {
    // height: 57.8667vw;
    padding: 10px 15px;
    background-color: #fff;
    overflow: hidden;
    .talk_tet {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 3.2vw;
      height: 5.3333vw;
      // background-color: pink;

      h3 {
        font-size: 3.7333vw;
        color: #303133;
        font-weight: normal;
      }
      span {
        font-size: 3.2vw;
        color: #999;
        .iconfont {
          font-size: 3.2vw;
          color: #999;
        }
      }
    }

    // 评论内容
    .talk_content {
      // background-color: pink;
      .item {
        height: 24vw;
        padding: 1.8667vw 0.5333vw;
        font-size: 3.4667vw;
        border-bottom: 0.5px solid #f5f5f5;
        .user {
          display: flex;
          margin-bottom: 1.3333vw;
          height: 6.6667vw;
          .pic {
            width: 6.6667vw;
            height: 6.6667vw;
            border-radius: 50%;
            overflow: hidden;
          }
          .uname {
            margin: 0 1.8667vw;
            line-height: 6.6667vw;
          }
          .star {
            display: flex;
            align-items: center;
            margin-top: -1.0667vw;
            .iconfont {
              color: #fb0;
            }
          }
        }

        .txt {
          margin: 2.1333vw 0;
        }

        .time {
          margin-top: 1.3333vw;
          color: #999;
        }
      }
    }
  }

  // 商品详情
  .goodDetails {
    .tit {
      height: 12.2667vw;
      padding: 3.4667vw 4vw;
      font-size: 3.7333vw;
      color: #303133;
    }
    .content {
      min-height: 133.3333vw;
      // background-color: pink;
      img {
        width: 100% !important;
      }
      video {
        width: 100% !important;
      }
    }
  }
}
